<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
		<div id='report' class="user-report">
			<div class="top-part items-display-flex flex-row flex-between">
				<div class="item items-display-flex flex-row flex-between">
					<div class="icon color1">
						<span class="iconfont icon-fanxian"></span>
					</div>
					<div class="lab">
						累计返现（元）
						<div>{{val1}}</div>
					</div>
				</div>
				<div class="item items-display-flex flex-row flex-between">
					<div class="icon color2">
						<span class="iconfont icon-hezuoguanxi"></span>
					</div>
					<div class="lab">
						合伙人
						<div>{{val2}}</div>
					</div>
				</div>
				<div class="item items-display-flex flex-row flex-between">
					<div class="icon color3">
						<span class="iconfont icon-zhuceshenpi"></span>
					</div>
					<div class="lab">
						注册用户
						<div>{{val3}}</div>
					</div>
				</div>
				<div class="item items-display-flex flex-row flex-between">
					<div class="icon color4">
						<span class="iconfont icon-yanpiaojilu"></span>
					</div>
					<div class="lab">
						报备看房
						<div>{{val4}}</div>
					</div>
				</div>
			</div>
			<div class="record-list">
				<div class="title"><span class="iconfont icon-datijilu"></span>返现记录</div>
				<div class="list-head items-display-flex flex-row">
					<div class="width1 bleft btop bbottom bright">序号</div>
					<div class="width2 btop bright bbottom">楼盘名称</div>
					<div class="width3 btop bright bbottom">户型面积</div>
					<div class="width4 btop bright bbottom">总价</div>
					<div class="width5 btop bright bbottom">返现金额</div>
					<div class="width6 btop bright bbottom">返现时间</div>
				</div>
				<div v-for='(item,index) in listcnt' class="list-cnt items-display-flex flex-row">
					<div class="width1 bleft btop bbottom bright" v-bind:class='[index%2==0 ? "bg1":"bg2"]'>{{index+1+(curpage-1)*pagesize}}</div>
					<div class="width2 btop bright bbottom" v-bind:class='[index%2==0 ? "bg1":"bg2"]'>{{item.house_name}}</div>
					<div class="width3 btop bright bbottom" v-bind:class='[index%2==0 ? "bg1":"bg2"]'>{{item.room}}</div>
					<div class="width4 btop bright bbottom" v-bind:class='[index%2==0 ? "bg1":"bg2"]'>{{item.total_price}}万</div>
					<div class="width5 btop bright bbottom special-color" v-bind:class='[index%2==0 ? "bg1":"bg2"]'>+{{item.return_amount}}元</div>
					<div class="width6 btop bright bbottom" v-bind:class='[index%2==0 ? "bg1":"bg2"]'>{{item.return_time}}</div>
				</div>
				<div class="page-nav items-display-flex flex-row">
					<div @click='prevpage()' class="left-icon" v-bind:class='[curpage<=1 ? "icon-color1":"icon-color2"]'>
						<span class="iconfont icon-nvxingfuben"></span>
					</div>
					<div class="num">
						{{curpage}} / {{totalcount}}
					</div>
					<div @click='nextpage()' class="right-icon" v-bind:class='[curpage>=totalcount ? "icon-color1":"icon-color2"]'>
						<span class="iconfont icon-nvxingfuben1"></span>
					</div>
				</div>
			</div>
		</div>
	</body>
	<script>
		
		var curUserid = 0;
		var reportpart = new Vue({
			el:'#report',
			data:{
				val1:0,
				val2:0,
				val3:0,
				val4:0,
				listcnt:[],
				totalcount:0,
				curpage:1,
				pagesize:5
			},
			methods:{
				prevpage:function(){
					if(this.curpage <= 1){
						return;
					}
					this.curpage = this.curpage - 1;
					loadUserYWList(this.curpage);
				},
				nextpage:function(){
					if(this.curpage >= this.totalcount){
						return;
					}
					this.curpage = this.curpage + 1;
					loadUserYWList(this.curpage);
				}
			}
		});
		
		$(document).ready(function(){
//			loadUserYWList(reportpart.curpage);
//			loadUserInfo();
		});
		
		function loadUserYWList(pgindex){
			var uid = curUserid;
			var urlstr = publicUrl+'/v1/wx-user/return?uid='+uid+'&page='+pgindex+'&pageSize='+reportpart.pagesize;
			jQuery.get(urlstr,{},function(res){
				console.log(res);
				var datalist = res.data.list;
				for(var i=0;i<datalist.length;i++){
					for(var keystr in datalist[i]){
						if(datalist[i][keystr]==''){
							datalist[i][keystr] = '--'
						}
					}
				}
				reportpart.listcnt = datalist;
				reportpart.totalcount = Math.ceil(res.data.pageNum/reportpart.pagesize);
				if(reportpart.totalcount == 0){
					reportpart.curpage = 0;
				}
			});
		}
		function RefUserInfoBack(){			
			var cuinfo = getUserInfo();
			if(cuinfo){
				reportpart.val1 = cuinfo.selfAmount;
				reportpart.val2 = cuinfo.refereeCount;
				reportpart.val3 = cuinfo.userCount;
				reportpart.val4 = cuinfo.reportCount;
			}
		}
		
		setTimeout(function(){
			var cuinfo = getUserInfo();
			if(cuinfo){
				curUserid = cuinfo.uid;
				loadUserYWList(reportpart.curpage);
				loadUserInfo(RefUserInfoBack,curUserid);
			}
		},200);
		
	</script>
</html>
